import React, { useState } from "react";
import "./home.modules.less";
import Search from "./Search";
import ArticleItem from "./ArticleItem";
import { getArticleList } from "@/api/index.ts";

export default function Home() {
  const [articleData, setArticleData] = useState([]);
  const [articleId, setArticleId] = useState(0);

  const onIdValue = (id: string) => {
    setArticleId(id);
    onSearch();
  };

  // 获取文章列表数据
  const onSearch = () => {
    getArticleList(articleId).then((res) => {
      // console.log(articleData);
      setArticleData(res.data.results || []);
    });
  };
  return (
    <div className="home-wrapper">
      <Search setNavId={onIdValue} />
      <div className="box">
        {(articleData || []).map((item) => {
          return <ArticleItem key={item.id} info={item} />;
        })}
      </div>
    </div>
  );
}
